<template>
  <div>
    <div v-for="(i, index) in couse" :key="index">
      <van-row>
        <van-col span="16">
          {{ i.name }}
        </van-col>
        <van-col span="8">
          {{ i.collent_sum }}
        </van-col>
      </van-row>

      <van-row>
        <van-col span="24">
          {{ i.description }}
        </van-col>
      </van-row>
    </div>

    <div>
      <p v-for="(i, index) in list" :key="index">
        <van-button @click="showvideo(i.id)">{{ i.title }}</van-button>
      </p>
    </div>
    <van-dialog v-model="show" title="标题" show-cancel-button>
      <!-- 视频 -->
      <video width="320" height="240" controls autoplay>
        <source :src="url" type="video/mp4" />
      </video>
    </van-dialog>
  </div>
</template>
    
    <script>
export default {
  data() {
    return {
      list: [],
      uid: this.$route.params.id,
      couse: [],
      show: false,
      url: "",
    };
  },
  methods: {
    getDetail() {
      this.axios.get("detail?id=" + this.uid).then((res) => {
        this.list = res.data.slist;
        this.couse = res.data.clist;
      });
    },
    showvideo(id) {
      this.axios
        .get(
          "getVideo?id=" +
            id +
            "&userid=" +
            localStorage.getItem("userid") +
            "&courseid=" +
            this.uid
        )
        .then((res) => {
          if (res.data.code == 200) {
            this.show = true;
            this.url = res.data.url;
          } else {
            alert(res.data.msg);
          }
        });
    },
  },
  mounted() {
    this.getDetail();
  },
};
</script>
    
    <style>
</style>